<template>
  <div class="container">
    <div class="gm-container">
      <div class="box">
        <nes-vue
          ref="nes"
          :url="gameURL"
          :width="512"
          :height="480"
        />
      </div>
      <div class="btns">
        <a-select
          name="rom"
          class="slt"
          :value="gameURL"
          @change="selectRom"
        >
          <a-select-opt-group v-for="rom in gameList" :label="rom.title" :key="rom">
            <a-select-option
              v-for="item in rom.items"
              :value="item[1]"
              :key="item"
            >
              {{ item[0] }}
            </a-select-option>
          </a-select-opt-group>
        </a-select>
        <a-button @click="resetGame">
          Reset
        </a-button>
        <a-button @click="stopGame">
          Stop
        </a-button>
        <a-button @click="pause" style="width:4em" :disabled="disable">
          {{ pauseLabel }}
        </a-button>
        <a-button @click="playTAS" :disabled="disable">
          Play TAS Video
        </a-button>
        <a-button @click="stopTAS" v-show="tasPlaying">
          Stop TAS Video
        </a-button>
      </div>
    </div>
    <a-table :pagination="false" :dataSource="dataSource" :columns="columns" />
  </div>
 
</template>
<script setup>
import { ref, computed } from 'vue'
import { NesVue } from 'nes-vue'

const gameList = [
  {
    title: '热门游戏',
    items:  [
      ['沙罗曼蛇 (U) Life Force [!]', 'roms/Life Force [!].nes'],
      ['超级马里奥1 (W) Super Mario Bros. [!]', 'roms/(W) Super Mario Bros. [!].nes'],
      ['坦克 (J) Battle City [!]', 'roms/(J) Battle City.nes'],
      ['魂斗罗1 (U) 30S [!]', 'roms/Contra1(U)30S.nes'],
      ['赤影战士 Kage [!]', 'roms/Kage.nes'],
      ['脱狱 Cross Fire (J)', 'roms/Cross Fire (J).nes'],
      ['双截龙2 Double Dragon2 [!]', 'roms/Double Dragon2.nes'],
      ['塞尔达传说2：林克的冒险 [!] Zelda II - The Adventure of Link(U) [!]', 'roms/Zelda II - The Adventure of Link (U).nes'],
      ['冒险岛1 (J) Adventure Island [!]', 'roms/(J) Takahashi Meijin no Bouken Shima [!].nes'],
      ['1943 (U) 1943 - The Battle of Midway [!]', 'roms/1943.nes'],
      ['火箭车 (J) Road Fighter [!]', 'roms/(J) Road Fighter [!].nes'],
      ['越野机车 (JU) Excitebike [!]', 'roms/(JU) Excitebike [!].nes'],
      ['功夫 (J) (V1.2) Yie Ar Kung-Fu [!]', 'roms/(J) (V1.2) Yie Ar Kung-Fu [!].nes'],
      ['淘金者(汉化) [!]', 'roms/TaoJinZhe.nes'],
      ['俄罗斯方块 (U) Tetris 2 [!]', 'roms/Tetris 2 (U) [!].nes'],
      ['中国象棋 [!]', 'roms/Zhong Guo Xiang Qi.nes'],
      ['五子棋 (5) 日版 [!]', 'roms/5.nes'],
      ['炸弹人1 [!] (J) Bomberman [!]', 'roms/(J) Bomberman [!].nes'],
    ]
  },
  {
    title: '超级玛丽',
    items:  [
      ['超级马里奥1 (W) Super Mario Bros. [!]', 'roms/(W) Super Mario Bros. [!].nes'],
      ['超级马里奥2 (W) Super Mario Bros. 3 (U)', 'roms/Super Mario Bros. 3 (U) (PRG1) [!].nes'],
      ['马里奥拆屋工 (W) Wrecking Crew', 'roms/(W) Wrecking Crew [!].nes'],
      ['马里奥医生 (JU) Dr. Mario', 'roms/Dr. Mario (JU).nes'],
    ]
  },
  {
    title: '坦克大战',
    items:  [
      ['坦克大战 (J) Battle City [!]', 'roms/(J) Battle City.nes'],
      ['导弹坦克 (Ch) Missile Tank', 'roms/(Ch) Missile Tank.nes'],
      ['坦克1990 (Ch) Tank 1990', 'roms/(Ch) Tank 1990.nes'],
    ],
  },
  {
    title: '魂斗罗',
    items:  [
      ['魂斗罗1 (U) 30S [!]', 'roms/Contra1(U)30S.nes'],
      ['魂斗罗1 (U) 30', 'roms/Contra1(U)30.nes'],
      ['魂斗罗1 (U) 30F', 'roms/Contra1(U)30F.nes'],
      ['魂斗罗1 (U) 30L', 'roms/Contra1(U)30L.nes'],
      ['魂斗罗1 (U) 30M', 'roms/Contra1(U)30M.nes'],
      ['魂斗罗1 (U) S [!]', 'roms/Contra1(U)S.nes'],
      ['魂斗罗1 (U) F', 'roms/Contra1(U)F.nes'],
      ['魂斗罗1 (U) L', 'roms/Contra1(U)L.nes'],
      ['魂斗罗1 (U) M', 'roms/Contra1(U)M.nes'],
    ],
  },
  {
    title: '双截龙',
    items: [
      ['双截龙2 Double Dragon2 [!]', 'roms/Double Dragon2.nes'],
      ['双截龙1 Double Dragon1', 'roms/Double Dragon1.nes'],
      ['双截龙3 Double Dragon3', 'roms/Double Dragon3.nes'],
      ['双截龙4 Double Dragon4', 'roms/Double Dragon4.nes'],
    ],
  },
  {
    title: '淘金者',
    items: [
      ['淘金者(汉化) [!]', 'roms/TaoJinZhe.nes'],
      ['淘金者(J)', 'roms/Championship Lode Runner (J).nes'],
    ],
  },
  {
    title: '俄罗斯方块',
    items: [
      ['俄罗斯方块2 (U) Tetris 2 [!]', 'roms/Tetris 2 (U) [!].nes'],
      ['俄罗斯方块 LJ65', 'roms/lj65.nes'],
      ['俄罗斯方块 Tetris(U)', 'roms/Tetris (U) [!].nes'],
      ['俄罗斯方块 (Tengen) Tetris [!]', 'roms/(Tengen) Tetris [!].nes'],
    ],
  },
  {
    title: '飞机类',
    items: [
      ['沙罗曼蛇 (U) Life Force [!]', 'roms/Life Force [!].nes'],
      ['1943 (U) 1943 - The Battle of Midway [!]', 'roms/1943.nes'],
      ['兵蜂1 (J) TwinBee [!]', 'roms/(J) TwinBee [!].nes'],
    ],
  },
  {
    title: '赛车类',
    items: [
      ['火箭车 (J) Road Fighter [!]', 'roms/(J) Road Fighter [!].nes'],
      ['越野机车 (JU) Excitebike [!]', 'roms/(JU) Excitebike [!].nes'],
      ['F1赛车 (J) F-1 Race', 'roms/(J) F-1 Race [!].nes'],
      ['摩托车大赛 (JU) (PRG0) Mach Rider', 'roms/(JU) (PRG0) Mach Rider [!].nes'],
    ],
  },
  {
    title: '运动类',
    items: [
      ['网球Tennis(JU)', 'roms/Tennis (JU) [!].nes'],
      ['高尔夫 Golf (JU)', 'roms/Golf (JU).nes'],
    ],
  },
  {
    title: '棋牌类',
    items: [
      ['中国象棋 [!]', 'roms/Zhong Guo Xiang Qi.nes'],
      ['五子棋 (5) 日版 [!]', 'roms/5.nes'],
      ['Concentration Room', 'roms/croom.nes'],
      ['AV麻雀俱乐部 (Hacker) AV Mahjongg', 'roms/(Hacker) AV Mahjongg.nes'],
    ],
  },
  {
    title: '其他',
    items: [
      ['马戏团 (J) Circus Charlie', 'roms/(J) Circus Charlie [!].nes'],
      ['敲冰块 (J) Ice Climber', 'roms/(J) Ice Climber.nes'],
      ['纽约大拳猫 (JP)', 'roms/RockinCats.nes'],
      ['撞球咖啡馆 Shufflepuck Cafe', 'roms/Shufflepuck Cafe.nes'],
      ['泡泡龙 Bubble Bobble (U)', 'roms/Bubble Bobble (U).nes'],
      ['地底探险1 (J) Spelunker', 'roms/(J) Spelunker [!].nes'],
      ['快乐猫 (J) Mappy', 'roms/(J) Mappy [!].nes'],
      ['成龙踢馆1 (J) Spartan X', 'roms/(J) Spartan X [!].nes'],
      ['猪小弟 (J) Pooyan', 'roms/(J) Pooyan.nes'],
      ['打砖块1 (J) Arkanoid', 'roms/(J) Arkanoid [!].nes'],
    ],
  },
  {
    title: '不可用',
    items: [
      ['小蜜蜂 (J) Galaxian', 'roms/(J) Galaxian [!].nes'],
      ['赤色要塞 (KC) Jackal [!]', 'roms/Jackal.nes'],
      ['花式撞球 (U) Side Pocket', 'roms/Side Pocket.nes'],
      ['彩虹岛 (U) Rainbow Islands', 'roms/Rainbow Islands.nes'],
      ['快打旋风 (U) Mighty Final Fight [!]', 'roms/Mighty Final Fight.nes'],
      ['忍者龙剑传1 (PC10) Ninja Gaiden [!]', 'roms/Ninja_Gaiden1.nes'],
      ['忍者龙剑传2 (PC10) Ninja Gaiden II [!]', 'roms/Ninja_Gaiden2.nes'],
      ['忍者龙剑传3 (PC10) Ninja Gaiden III [!]', 'roms/Ninja_Gaiden3.nes'],
      ['七宝奇谋1 (J) Goonies, The [!]', 'roms/(J) Goonies, The [!].nes'],
      ['南极大冒险 (J) Antarctic Adventure', 'roms/(J) Antarctic Adventure [!].nes'],
      ['叮当1 (J) Dig Dug', 'roms/(J) Dig Dug [!].nes'],
      ['影之传说 (J) Kage no Densetsu [!]', 'roms/(J) Kage no Densetsu [!].nes'],
    ],
  }
]

const gameURL = ref(gameList[0].items[0][1])
const nes = ref(null)
const disable = ref(true)
const isPaused = ref(false)
const pauseLabel = computed(() => isPaused.value ? 'Play' : 'Pause')

const dataSource = [
  {
    key: '1',
    name: 'Up',
    play1: 'W',
    play2: '↑',
  },
  {
    key: '2',
    name: 'Down',
    play1: 'S',
    play2: '↓',
  },
  {
    key: '3',
    name: 'Left',
    play1: 'A',
    play2: '←',
  },
  {
    key: '4',
    name: 'Right',
    play1: 'B',
    play2: '→',
  },
  {
    key: '5',
    name: 'B',
    play1: 'J',
    play2: 'Num1',
  },
  {
    key: '6',
    name: 'A',
    play1: 'K',
    play2: 'Num2',
  },
  {
    key: '7',
    name: 'Select',
    play1: 'Space',
    play2: 'Num/',
  },
  {
    key: '8',
    name: 'Start',
    play1: 'Enter',
    play2: 'Num*',
  }
]

const columns = [
    {
      title: '按键',
      dataIndex: 'name',
      key: 'name',
    },
    {
      title: 'play1',
      dataIndex: 'play1',
      key: 'play1',
    },
    {
      title: 'play2',
      dataIndex: 'play2',
      key: 'play2',
    },
  ]

function resetGame() {
  nes.value.reset()
}

function stopGame() {
  nes.value.stop()
  disable.value = true
}

function selectRom(v) {
  gameURL.value = v
  disable.value = true
  tasPlaying.value = false
}

const tasPlaying = ref(false)
function playTAS() {
  nes.value.fm2Play()
  tasPlaying.value = true
}

function stopTAS() {
  nes.value.fm2Stop()
  tasPlaying.value = false
}


function pause() {
  if (isPaused.value) {
    nes.value.play()
  } else {
    nes.value.pause()
  }
  isPaused.value = !isPaused.value
}
</script>

<style>
.container {
  display: flex;
  align-items: center;
  justify-content: center;
}
.gm-container {
  flex-direction: column;
  display: flex;
  align-items: center;
  justify-content: center;
}

.btns {
  margin-top: 5px;
}

button, select, input {
  margin-right: 5px
}

.slt {
  width: 100px;
}
</style>
